.SmallScreen {
	display: none;
}

article	{
	width: 282px;
	height: 100%;
	box-sizing: border-box;
	background-color: #1E262C;
	display: flex;
	flex-direction: column;
	align-items: center;
	position: relative;
}

img {
	margin-top: 35px;
	width: 107px;
	height: 35px;
}

.search {
	position:relative;
	box-sizing: border-box;
	margin-top: 30px;
	height: 47px;
}

input {
	padding-left: 42px;
	width: 255px;
	height: 100%;
	color: #2b2626;
	background-color: #ffffff;
	border-radius: 30px;
	border: 1px solid #1E262C;
	font-size: 16px;
}

input::-webkit-input-placeholder { 
/* WebKit browsers */ 
color: #b7b9be; 
} 
input:-moz-placeholder { 
/* Mozilla Firefox 4 to 18 */ 
color: #b7b9be; 
} 
input::-moz-placeholder { 
/* Mozilla Firefox 19+ */ 
color: #b7b9be; 
} 
input:-ms-input-placeholder { 
/* Internet Explorer 10+ */ 
color: #b7b9be; 
}


.icon-sousuo {
	top: 50%;
	left: 15px;
	font-size: 18px;
	color: #70767e;
	position: absolute;
	transform: translateY(-58%);
}

.EAplay_select {
	position: relative;
	margin-top: 17px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	height: 50px;
	box-sizing: border-box;
	transition:all 0.5s;
}



.EAplay_select span {
	margin-left: 21px;
	font-size: 14px;
	color: #ffffff;
}

.icon-sanjiao {
	margin-right: 31px;
	font-size: 12px;
	color: #ffffff;
}

.shop_select {
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	height: 50px;
}

.shop_select span {
	margin-left: 21px;
	font-size: 14px;
	color: #ffffff;
}

.Browse_select {
	position: relative;
	box-sizing: border-box;
	display: flex;
	width: 100%;
	height: 35px;
	align-items: center;
	justify-content: space-between;
	transition:all 0.5s;
}

.Browse_select span {
	margin-left: 41px;
	font-size: 13px;
	color: #ffffff;	
}

.sale_select {
	position: relative;
	box-sizing: border-box;
	display: flex;
	width: 100%;
	height: 35px;
	align-items: center;
	justify-content: space-between;
	transition:all 0.5s;
}

.sale_select span {
	margin-left: 41px;
	font-size: 13px;
	color: #ffffff;	
}

.newline {
	margin-top: 18px;
	width: 100%;
	height: 0;
	border-top: 2px solid #333a40;
}

div[class*=_select]:hover{
	background-color: #4c5259;
}


.Login_registration {
	width: 100%;
	height: 130px;
	position: absolute;
	bottom: 50px;
	background-color: #1E262C;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
	box-sizing: border-box;
}

.Login {
	width: 248px;
	height: 47px;
	border-radius: 8px;
	background-color: #f56c2d;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor:pointer;
}

.Login span {
	color: #ffffff;
	font-size: 15px;
}

.Login:hover {
	background-color: #C85E36;
}

.registration {
	width: 246px;
	height: 45px;
	border-radius: 8px;
	margin-bottom: 24px;
	border: 1px solid #ffffff;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor:pointer;
}

.registration span {
	color: #ffffff;
	font-size: 15px;
}


.perch {
	width: 100%;
	height: 50px;
	position: absolute;
	bottom: 0;
	background-color: #1E262C;	
	overflow: hidden;
	border-top: 2px solid #2b3239;
}

.Orange_border {
	position: absolute;
	width: 0;
	height: 100%;
	top: 0;
	left: 0;
	background-color: #f56c2d;
	transition:all 0.3s;
}


/*橙色左边框 专业背景色*/
.Orange_border_bc {
	background-color: #3A434C;
}


/*.Orange_border_out {
	animation-name: fade_in;
	animation-duration: 0.5s;
	animation-timing-function: ease;
	animation-iteration-count: 1;
}*/

/*侧边栏隐藏部分*/

.EA_play {
	display: flex;
	flex-direction: column;
	position: absolute;
	left: 280px;
	top: 165px;
	width: 190px;
	height: 180px;
	background-color: #ffffff;
	border-radius: 4px;
	overflow: hidden;
	font-size: 16px;
	font-weight: 400;
	margin-left: 7px;
	z-index: 1000000;
	box-sizing: border-box;
	visibility: hidden;

}


/*EA_play 隐藏部分显示过程*/
.visible{
	visibility: visible;
	animation-name: fade_in;
	animation-duration: 0.5s;
	animation-timing-function: ease;
	animation-iteration-count: 1;
}

/*EA_play 隐藏过程*/
.EA_play_hide {
	animation-name: fade_out;
	animation-duration: 0.5s;
	animation-timing-function: ease;
	animation-iteration-count: 1;
}

.EA_play li {
	display: flex;
	align-items: center;
	flex:1;
	cursor: pointer;
}

.EA_play span {
	margin-left: 10px;
}

.EA_play li:hover {
	background-color: rgb(237,241,242);
}



/*.EA_play:hover {
	visibility: visible;
}*/

@keyframes fade_in {
	0%{
		transform: translateX(-10px);
	}
	100% {

	}
}

@keyframes fade_out {
	0%{
		opacity:1;
		left: 280px;
	}
	100% {
		opacity:0;
		left: 270px;
	}
}